<div data-toggle="topjui-layout" data-options="fit:true">
	<div data-options="region:'center',title:'',split:true,border:false">
		<table class="editTable">
			<tr>
				<td style="text-align:right">用户名</td>
				<td><input type="text" name="username"
					data-toggle="topjui-textbox"
					data-options="required:true,width:300,validType:'length[0,36]'"></td>
			</tr>
			<tr>
				<td style="text-align:right">用户昵称</td>
				<td><input type="text" name="nickname"
					data-toggle="topjui-textbox"
					data-options="required:true,width:300,validType:'length[0,36]'"></td>
			</tr>
			<tr>
				<td style="text-align:right">密码</td>
				<td><input type="text" name="password"
					data-toggle="topjui-passwordbox"
					data-options="required:true,width:300,validType:'length[0,36]'"></td>
			</tr>
			<tr>
				<td style="text-align:right">角色</td>
				<td><input type="text" name="roleIds"
					data-toggle="topjui-combogrid"
					data-options="required:true,width:300,panelWidth:300,panelHeight:'auto',hasDownArrow:true,editable:false,
						multiple:true,pagination:true,pageSize:5,pageList:[5,10,20],
			 			idField:'id',
						textField:'name',
						url:'/system/role/list',
						columns:[[
							{field:'id',title:'id',width:100,checkbox:true},
							{field:'name',title:'名称',width:100},
							{field:'remark',title:'备注',width:160}
						]]"></td>
			</tr>
			<tr>
				<td style="text-align:right">状态</td>
				<td><input type="text" name="status"
					data-toggle="topjui-combobox"
					data-options="required:true,width:300,panelHeight:'auto',hasDownArrow:true,editable:false,
						valueField:'id',
						textField:'text',
						data: [
							{id: '0',text: '启用'},
							{id: '1',text: '停用'}
						]"></td>
			</tr>
			<tr>
				<td style="text-align:right">备注</td>
				<td><input type="text" name="remark"
					data-toggle="topjui-textbox"
					data-options="width:300,validType:'length[0,255]'"></td>
			</tr>
		</table>
	</div>
	
	<div data-options="region:'east',title:'',split:true,border:false,width:'50%'">
		<table class="editTable">
			<tr>
				<td style="text-align:right">头像</td>
				<td><input type="text" name="avatar"
					data-toggle="topjui-uploadbox"
					data-options="width:300,editable:false,
						accept:'images',
						buttonText:'上传图片',
						uploadUrl:'/fastdfs/uploadFile'"></td>
			</tr>
			<tr>
				<td style="text-align:right">性别</td>
				<td><input type="text" name="gender"
					data-toggle="topjui-combobox"
					data-options="width:300,panelHeight:'auto',hasDownArrow:true,editable:false,
						valueField:'id',
						textField:'text',
						data: [
							{id: '0',text: '男'},
							{id: '1',text: '女'}
						]"></td>
			</tr>
			<tr>
				<td style="text-align:right">邮箱</td>
				<td><input type="text" name="email"
					data-toggle="topjui-textbox"
					data-options="width:300,validType:'email'"></td>
			</tr>
			<tr>
				<td style="text-align:right">电话</td>
				<td><input type="text" name="mobile"
					data-toggle="topjui-textbox"
					data-options="width:300,validType:'cellphone'"></td>
			</tr>
			<tr>
				<td style="text-align:right">地址</td>
				<td><input type="text" name="address"
					data-toggle="topjui-textbox"
					data-options="width:300,validType:'length[0,255]'"></td>
			</tr>
		</table>
	</div>
</div>
